<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
  html { height: 100% }
  body { height: 100%; margin: 0px; padding: 0px }
  #map_canvas { height: 100% }
</style>
<script type="text/javascript"
goo    src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">

  var geocoder;
  var map;
  function initialize2() {
    // sets up the javascript handles for mapping things.
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(-34.397, 150.644);
    var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
	
	// add a marker to the map and make it update lat/lng on move.
	marker= new google.maps.Marker({
            map: map,
            position: new google.maps.LatLng(-34.397,150.644),
			draggable: true,
			visible: false
        });
	
	google.maps.event.addListener(marker, "drag", function(event) {
		updateLatLng()});
	}

  function updateLatLng() {
		document.getElementById("lat").innerHTML=Math.round(10000*marker.position.lat())/10000;
		document.getElementById("lng").innerHTML=Math.round(10000*marker.position.lng())/10000;
	}
	

  function codeAddress() {
    // takes an address and attempts to geocode it
    var address = document.getElementById("address").value;
    geocoder.geocode( { 'address': address, 'region':'UK'}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
		document.getElementById("addr").innerHTML=results[0].formatted_address;
			
		marker.setPosition(results[0].geometry.location);
		marker.setVisible(true);
		updateLatLng();

		} else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
  }
  
  function reverseGeocode() {
	geocoder.geocode( {'latLng':marker.position}, function (results, status) {
		if (status == google.maps.GeocoderStatus.OK) {
			document.getElementById("addr").innerHTML=results[0].formatted_address;
		} else {
			alert("Geocode was not successful for the following reason: " + status);
		}
	});
  }

  function submit() {
	window.opener.document.getElementById("lat").value=Math.round(10000*marker.position.lat())/10000;
	window.opener.document.getElementById("lng").value=Math.round(10000*marker.position.lng())/10000;
	window.close();
  }
  

</script>
</head>
<body onload="initialize2()">
 <div id="map_canvas" style="width: 480px; height: 320px;"></div>
 <div>
    <input id="address" type="textbox" value="Sydney, NSW">
    <input type="button" value="Geocode" onclick="codeAddress()">
	<span id='addr'></span>
 </div>
 <div>
	(<span id='lat'></span>, <span id='lng'></span>) <input type='button' value='Reverse Geocode' onclick="reverseGeocode()">
 </div>
<input type='submit' onclick="submit()">
</body>
</html>

<!--https://maps.googleapis.com/maps/api/geocode/json?sensor=false&region=uk&address=-->
